<template>
    <popup
        title="数据详情"
        :show="showModel"
        :async-close="true"
        confirmButtonText=""
        cancelButtonText=""
        width="1000px"
        @close="showModel = false"
    >
        <div class="p-6">
            <el-form disabled label-position="top">
                <el-form-item prop="question" label="文档内容">
                    <el-input
                        v-model="formData.question"
                        type="textarea"
                        resize="none"
                        :rows="10"
                        clearable
                    />
                </el-form-item>
                <el-form-item prop="answer" label="补充内容">
                    <el-input
                        v-model="formData.answer"
                        type="textarea"
                        resize="none"
                        :rows="10"
                        clearable
                    />
                </el-form-item>
            </el-form>
        </div>
    </popup>
</template>

<script setup lang="ts">
import { useVModels } from '@vueuse/core'

const props = withDefaults(
    defineProps<{
        modelValue: any
        show: boolean
    }>(),
    {}
)

const emits = defineEmits<{
    (event: 'update:modelValue', value: any): void
    (event: 'update:show', value: boolean): void
}>()

const { modelValue: formData, show: showModel } = useVModels(props, emits)
</script>
